<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
        <base href="<%=basePath%>">
        
        <title>利用JQuery+Ajax获取JSON数据</title>
        
 <meta http-equiv="pragma" content="no-cache">
 <meta http-equiv="cache-control" content="no-cache">
 <meta http-equiv="expires" content="0">        
 <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
 <meta http-equiv="description" content="This is my page">
 <!--
 <link rel="stylesheet" type="text/css" href="styles.css">
 -->  <style type="text/css">
<!--
div {
 background-color: #F06;
 height: 100px;
 width: 300px;
}
.myc {
 background-color: blue;
}
-->
  </style>
  
  <script type="text/javascript" charset="utf-8" src="js/jquery-1.2.6.min.js" ></script>
  <script type="text/javascript">
 $(function(){
      $("#load").click(function(){
       $("div").toggleClass("myc");
       //$.get(
        //"json",
        //{a:1,b:2},
        //function(data){
         //alert(data);
        //}
       //);
       $.ajax({
        type:"get",           
               url:"<%=basePath %>/client/tongzhou.action",        
                    data:"a=1&b=2&c=3", 
                    dataType:"json",
                       success:function(data){
                     var items=data.list;
         for(var i =0;i<items.length;i++)
         {
          var item=items[i];
          //alert(item.username);
          $("#tar").append("用户名："+item.username+"<p>密码："+item.password);
         };            
                    }
       });
      });
 });
  </script>
  </head>
  
  <body> 
            <input type="button" value="点击以加载页面" id="load">
          <div id="tar"></div>
  </body>
</html>